import $ from '../jquery-3.4.1.min.js';
import ajax from '../utils/ajax.js';
//当点击收银台搜索的时候
/* 
1.获取输入的内容
2.根据获取的内容来渲染对应的数据
3.并且展示出搜索出的内容以及内容缴费
*/
const searchData = {
    type: "",
    value: ""
}
let {
    nowPage,//当前页面
    pageSize,//当前页面显示多少条数据
    total,//总共多少数据
    pages,//总共页数
    nowPageSize//当前页面实际多少数据

} = {
    nowPage: 1,//当前页面
    pageSize: 10,//当前页面显示多少条数据
    total: 0,//总共多少数据
    pages: 0,//总共页数
    nowPageSize: 0
}
$(`#searchBtn`).click(function (e) {
    searchData.type = $(`#cashier_searchInput`).val();
    searchData.value = $(`#cashier_searchval`).val();
    if (!searchData.value) {
        alert(`不能为空`)
        return
    }

    alert(`正在查询。。。`)
    showTypeIn();

    console.log(`================================================================================================`);
    // console.log(type);



})

// 点击搜索头部
$(`.search-title`).on(`click`, `span`, function (e) {
    const key = $(this).text();

    switch (key) {
        case `收银台`:
            $(`.main-cashier`).hide();
            $(`#searchCtn`).show();
            $(`.search-title span`).prop(`class`, ``);
            $(`.search-title span:first-child`).prop(`class`, `searchTitleAcitve`);
            break;
        case `历史缴费`:
            $(`.main-cashier`).hide();
            $(`#historyPayment`).show();
            $(`.search-title span`).prop(`class`, ``);
            $(`.search-title span:last-child`).prop(`class`, `searchTitleAcitve`);
            break;

        default:
            break;
    }
})

//搜索到的详情按钮
$(`.searchBtn`).on(`click`, `li`, function (e) {
    const key = $(this).text();
    switch (key) {
        case `返回`:
            showTag(`.main-cashier`, `#cashierIndex`);

            break;

        default:
            break;
    }
})

//点击收款
$(`.searchBtn`).on(`click`, `li`, async function (e) {
    const key = $(this).text();
    $(`.searchBtn li`).prop(`class`, ``);
    $(this).prop(`class`, `search_active`)
    switch (key) {
        case `收款`:
            const data = document.querySelectorAll(`.payReal`)
            let countPay = 0
            for (let i = 0; i < data.length; i++) {
                countPay = countPay + (data[i].innerHTML) * 1
            }
            let userPay = prompt(`你需要支付${countPay}元，输入金额进行购买`)


            while (userPay < countPay) {
                alert(`金额不足重新输入`)
                userPay = prompt(`你需要支付${countPay}元，输入金额进行购买`)
            }
            if (userPay == countPay) {
                alert(`支付成功 余额为0元`)
            } else if (userPay > countPay) {
                alert(`已支付 找零${userPay - countPay}`)
            }
            const res = await getFliterTypeIn();
            const room = res.data[0].room._id;
            // console.log(room);
            ajax({
                url: `/payTypeIn/AllchangeTypIn`,
                type: `POST`,
                data: { room },
                success(res) {
                    if (res.code == 200) {
                        showTypeIn();
                        console.log(`修改成功`);
                    }
                }
            })





            break;


        default:
            break;
    }
})

function showTag(hiden, show) {
    $(hiden).hide();
    $(show).show();
}


/* 
1.
输入的是房号
判断是那个房号 
需要得到这个房号的 ID

利用这个ID在这个库里面查 然后返回这条数据
*/
function getFliterTypeIn() {
    return new Promise((resolve, reject) => {
        ajax({
            url: `/payTypeIn/findMoreTypIn`,
            type: `POST`,
            data: {
                ...searchData,
                nowPage,
                pageSize
            },
            success(res) {
                if (res.code == 200) {
                    // total = res.total;//当前的总数据
                    resolve(res);
                    console.log(`从后端返回的typein类型-------------`, res);



                } else {
                    alert(`数据库暂无数据 请重新查询`);
                    console.log(`数据库暂无数据 请重新查询`);
                }
            }
        })
    })
}

//渲染数据
function renderTable(res) {
    const data = res.data

    const html = data.map(item => {
        return `<tr>
        <td>
        <input type="checkbox" name="" id="">
        </td>
        <td>类型</td>
        <td>${item.room ? item.room.ownerHomeNumber : `改房号被删除`}</td>
        <td>${item.setNameId ? item.setNameId.payClassName : `该项目名称被删除`}</td>
        <td>${item.time}</td>
        <td>${item.setNameId ? item.setNameId.paySetPrice : `该单价被删除`}</td>
        <td>${item.count}</td>
        <td>${item.shouldPay}</td>
        <td>0.00</td>
        <td>0.00</td>
        <td>${item.prestore}</td>
        <td class="payReal">${item.shouldPay - item.prestore}</td>
        </tr>`
    }).join(``);
    $(`#cashier_tbody`).html(html)


    const user = `
        <li>小区：<span>${data[0].communtiyId ? data[0].communtiyId.communityName : `该小区已被删除`}</span></li>
        <li>住户姓名：<span>${data[0].room ? data[0].room.ownerName : `该名字被删除`}</span></li>
        <li>手机号：<span>${data[0].room ? data[0].room.ownerPhone : `该手机号被删除`}</span></li>
        `



    $(`.search-particulars`).html(user)



    pages = res.pages;//当前的总页数
    let li = ``;
    for (let i = 1; i <= pages; i++) {
        li = li + `<li>${i}</li>`
    }
    $(`#cashier_ul`).html(li);
}


//展示

async function showTypeIn() {
    const res = await getFliterTypeIn();
    if (res.data.length < 1) {
        alert(`此人未欠费`)
        $(`#cashierIndex`).show();//隐藏搜索首页
        $(`#searchCtn`).hide();//展示搜索内容
        return
    }
    $(`#cashierIndex`).hide();//隐藏搜索首页
    $(`#searchCtn`).show();//展示搜索内容
    renderTable(res);
}